
.resource-style-box {
	width: 238px;
	height: 184px;
	border: 1px dashed #ccc;
	border-radius: 6px;
	text-align: center;
	padding-top: 30px;
	cursor: pointer;
	.xz-img {
		max-width: 100%;
		width: 100px;
	}
}
.resource-mouse-img {
	width: 238px;
	height: 184px;
	position: relative;
	text-align: center;
	.mouse-img {
		max-width: 100%;
		border-radius: 6px;
		height: 184px;
	}
	.moren-img {
		width: 238px;
		height: 184px;
	}
	.img-text {
		text-align: center;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.show-mask-layer {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		background: rgba(0, 0, 0, 0.5);
		width: 238px;
		height: 184px;
		color: #ccc;
		text-align: center;
		padding-top: 70px;
		.mask-layer-p1 {
			padding-bottom: 10px;
		}
		.mask-layer-p1,
		.mask-layer-p2 {
			cursor: pointer;
		}
	}
}

.resource-mouse-video {
	width: 238px;
	height: 184px;
	position: relative;
	.mouse-video {
		width: 238px;
		height: 184px;
	}
	.show-mask-layer {
		position: absolute;
		top: 0;
		width: 238px;
		color: #ccc;
		text-align: center;
		padding-top: 70px;
		z-index: 100;
		.mask-layer-p1 {
			padding-bottom: 10px;
		}
		.mask-layer-p1,
		.mask-layer-p2 {
			cursor: pointer;
		}
	}
}

